import { createSSRApp } from 'vue'

import pinia from './stores'
import './static/assets/wxss/iconfont.css'
// 用这个uniapp的socket才能广泛连接
import socket from './composables/websocket'
import 'animate.css'
import uView from '../src/components/vk-uview-ui_1.5.2'
import App from './App.vue'
import { apiUrl } from './url/index'
// import './utils/interceptor.ts'
// const socket = io('http://10.225.240.71:8082', {
//   query: {},
//   transports: ['websocket', 'polling'],
//   timeout: 5000,
// })

// socket.on('connection', (data) => {
//   console.log('ws 已连接')
// })

// socket.emit('message', 123)

// socket.on('sendMsg', (val) => {
//   console.log(val)
// })

export function createApp() {
  const app = createSSRApp(App)

  app.config.globalProperties.socket = socket
  app.config.globalProperties.$baseUrl = apiUrl
  app.use(pinia)
  app.use(uView)

  return {
    app,
  }
}

/*
用这个原因createSSRApp是这样，还有原因是为什么这个代码没有
app.mount('#app')  就可以渲染出来  解释在下面‘
、、、、、、、、、、、、、、、、、、、、、、、、
用createApp生成的app 就要挂载到dom上 app.mount('#app')，但是createSSRApp就不需要
在 Vue 的服务器端渲染（SSR）中，应用程序的挂载点不是通过 app.mount('#app') 来完成的，
而是通过特殊的 SSR 渲染函数 renderToString 或类似的函数来处理的。

在客户端渲染（Client-side Rendering，CSR）中，我们使用 app.mount('#app')
将 Vue 应用程序实例挂载到 HTML 页面中的某个 DOM 元素上，以便 Vue 管理该元素内的内容和交互。

但在服务器端渲染中，整个页面的初始 HTML 是在服务器上生成的，
而不是等到客户端 JavaScript 执行后再挂载。所以在上述代码中，createSSRApp(App)
创建的是用于服务器端渲染的 Vue 应用程序实例，返回的对象包含了这个实例，但并没有执行类似于 app.mount('#app') 的操作，
因为 SSR 的渲染方式不需要这样的挂载操作。

在 SSR 中，服务器会使用类似 renderToString 的方法来将 Vue 应用程序的初始状态渲染成 HTML 字符串，
然后将该字符串发送给客户端。一旦客户端收到 HTML 字符串，Vue 的客户端应用程序会在此基础上重新激活，并且接管页面的交互。

所以，这段代码返回了一个准备好进行服务器端渲染的 Vue 应用程序实例，但并没有涉及在客户端挂载这个实例到 DOM 元素上的操作。
*/
